new Vue({
    el: '#app',
    data: {
        loading: false,
        tableData: [],//列表数据源
        queryData: { //查询数据源
            orderId:'',//订单id
        },
        count: 0,//查询总数
        statusList:[],//订单状态列表
        dialogVisible:false,//是否显示订单详情
        detailInfo:null,//订单详情

    },
    created() {
        this.getList();//调用 订单列表接口

    },
    methods: {
        //详情按钮
        onDetail(row){
            this.getDetailInfo(row.id);

        },
        //分页监听事件
        handleCurrentChange(val) {
            this.queryData.page = val
            this.getList()
        },
        //分页监听事件
        handleSizeChange(val) {
            this.queryData.page = 1
            this.queryData.limit = val
            this.getList()
        },
        //获取订单列表接口
        getList() {
            this.loading = true
            $.ajax({
                type: 'post',
                url: '/orders/list',
                data: this.queryData,
                dataType: 'json',
                success: (res, s, xhr) => {
                    if (res.code == 0) {
                        //调用订单状态接口
                        this.getStatusList();
                        this.tableData = res.data.items
                        this.count = res.data.itemsTotalCount

                    } else {
                        this.$message.error(res.msg || '网络异常')
                    }
                    this.loading = false
                },
                error: (xhr, s, err) => {
                    console.log(xhr, s, err)
                    this.$message.error(err.msg || '网络异常')
                    this.loading = false
                    return false;
                }
            });
        },
        //订单状态接口
        getStatusList() {
            this.loading = true
            $.ajax({
                type: 'post',
                url: '/orders/statusList',
                data: {},
                dataType: 'json',
                success: (res, s, xhr) => {
                    if (res.code == 0) {
                        this.statusList = res.data
                        //将订单列表里的订单状态code 转换成 订单状态中name
                        this.tableData.forEach((item) =>{
                            this.statusList.forEach((item2) =>{
                                if (item.status == item2.key){
                                    item.statusName = item2.value
                                }
                            })
                        })

                    } else {
                        this.$message.error(res.msg || '网络异常')
                    }
                    this.loading = false
                },
                error: (xhr, s, err) => {
                    console.log(xhr, s, err)
                    this.$message.error(err.msg || '网络异常')
                    this.loading = false
                    return false;
                }
            });
        },
        //订单详情
        getDetailInfo(id){
            this.loading = true
            $.ajax({
                type: 'post',
                url: '/orders/info',
                data: {id:id},
                dataType: 'json',
                success: (res, s, xhr) => {
                    if (res.code == 0) {
                        this.dialogVisible = true
                        this.detailInfo = res.data

                    } else {
                        this.$message.error(res.msg || '网络异常')
                    }
                    this.loading = false
                },
                error: (xhr, s, err) => {
                    console.log(xhr, s, err)
                    this.$message.error(err.msg || '网络异常')
                    this.loading = false
                    return false;
                }
            });
        },
    }
})
